@charset "utf-8";

.badge-label {
    margin-top: -5px;
    padding: 20px;
    height: 140px;

    color: #fff;
    background-color: #4294ff;
    background-image: url(../images/index-card-badge.png);
    background-repeat: no-repeat;
    background-position: right;
    background-size: 130px;

    justify-content: space-between;

    .badge-text {
        font: normal 24px/40px "微软雅黑";
    }

    .badge-num {
        margin-right: 25%;

        font: bold 80px/80px "微软雅黑";
    }
}

main {
    display: grid;

    padding: 25px 10px;

    justify-content: space-around;
    grid-template-columns: repeat(auto-fill, 110px);

    .badge-medal {
        margin: 10px 0;
        width: 110px;
        height: 160px;

        img {
            width: 100%;
        }

        p {
            margin-top: 15px;

            font-size: 14px;
            text-align: center;

            color: #333;
        }
    }
}
